<ui:composition template="/WEB-INF/templates/main-template.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	
	<ui:define name="sidebar">
		<ui:include src="/WEB-INF/templates/public-sidebar.xhtml" />
	</ui:define>
	<ui:define name="content">
		<h:form>
		<p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();"/>  
              
		<p:dialog modal="true" widgetVar="statusDialog" showHeader="false"   
		        draggable="false" closable="false">  
		    <p:graphicImage value="/resources/styles/images/ajax-loading-bar.gif" />  
		</p:dialog> 
	<h:outputText value=" Employee Leave Status" styleClass="outputTextTitle" />
		
		<h:panelGrid columns="4" style="width: 650px; "  columnClasses="gridCellButtomLeftAligned, gridCellButtomLeftAligned, gridCellButtomLeftAligned">
				<h:panelGroup>
					<h:outputText value="Select Year" />
					<br />
					<p:selectOneMenu id="yearMenu" value="#{employeeLeaveStatusBean.selectedYear}" styleClass="selectOneMenu168pxFixedWidth">
						<f:selectItems value="#{employeeLeaveStatusBean.yearsMap}" />
					</p:selectOneMenu>
					<p:watermark for="yearMenu" value="Select Year" /> 
				</h:panelGroup>

				<h:panelGroup>
					<h:outputText value="Select Month" />
					<br />
					<p:selectOneMenu id="monthMenu" value="#{employeeLeaveStatusBean.selectedMonth}" styleClass="selectOneMenu168pxFixedWidth">
						<f:selectItems value="#{employeeLeaveStatusBean.monthsMap}" />
					</p:selectOneMenu>
					<p:watermark for="monthMenu" value="Select Month" />
				</h:panelGroup>
				
				<h:panelGroup>
					<h:outputText value="Select Status" />
					<br />
					<p:selectOneMenu id="moduleMenu" value="#{employeeLeaveStatusBean.selectedStatus}" styleClass="selectOneMenu168pxFixedWidth">
						<f:selectItem itemLabel="" itemValue="" />
						<f:selectItems value="#{employeeLeaveStatusBean.leaveStatusMap}" />
					</p:selectOneMenu>
					<p:watermark for="moduleMenu" value="Select Status" />
			      </h:panelGroup>	
				  <h:panelGroup>   
				  <h:outputText value="" />
					<br />
					 <p:commandButton  value="Search" actionListener="#{employeeLeaveStatusBean.searchActionListener}" update="@form"/>
				  </h:panelGroup>
			</h:panelGrid>	  

			<h:panelGrid style="width: 100%">	
			<h:outputText value=" Employee leave details" styleClass="outputTextTitle" rendered="#{employeeLeaveStatusBean.RENDERTABLE}"/>
		
		         <p:dataTable id="leaveStatus" style="width: 100%" value="#{employeeLeaveStatusBean.employeeLeaves}"								
									 var="employeeLeave" rendered="#{employeeLeaveStatusBean.RENDERTABLE}">
									<p:column>
										<f:facet name="header">
											<h:outputText value="Emp Id" />
										</f:facet>
										<h:outputText  value="#{employeeLeave.employee.employeeCode}"/>
									</p:column>
									
                                 <p:column>
										<f:facet name="header">
											<h:outputText value="Employee Name" />
										</f:facet>
										<h:outputText value="#{employeeLeave.employee.firstName} #{employeeLeave.employee.lastName}"/>
									</p:column>
						          <p:column>
										<f:facet name="header">
											<h:outputText value="Applied On" />
										</f:facet>
										<h:outputText value="#{employeeLeave.appliedOn}">
										 <f:convertDateTime pattern="dd-MMM-yyyy" timeZone="#{employeeLeaveStatusBean.defaultTimeZone}"/>
										</h:outputText>
									</p:column>
							      <p:column>
							 			<f:facet name="header">
											<h:outputText value="Leave Type" />
										</f:facet>
										<h:outputText value="#{employeeLeave.leaveType.leaveType}"/>
									</p:column>
									
									<p:column>
										<f:facet name="header">
											<h:outputText value="Leave From" />
										</f:facet>
										<h:outputText value="#{employeeLeave.periodFrom}">
									      <f:convertDateTime pattern="dd-MMM-yyyy" timeZone="#{employeeLeaveStatusBean.defaultTimeZone}"/>	
										</h:outputText>
									</p:column>
									<p:column>
										<f:facet name="header">
											<h:outputText value="Leave To" />
										</f:facet>
										<h:outputText value="#{employeeLeave.periodTo}">
										<f:convertDateTime pattern="dd-MMM-yyyy" timeZone="#{employeeLeaveStatusBean.defaultTimeZone}"/>
										</h:outputText>
									</p:column>
									
									<p:column>   
										<f:facet name="header">
											<h:outputText value="Approval Status" />
										</f:facet>
										<h:outputText value="#{employeeLeave.approvalStatus}" style="color:green;font-style:bold;" rendered="#{employeeLeave.approvalStatus eq 'APPROVED'}"/>
						                <h:outputText value="#{employeeLeave.approvalStatus}" style="color:#FFCCO;font-style:bold;" rendered="#{employeeLeave.approvalStatus eq 'IN PROCESS'}"/>
						                <h:outputText value="#{employeeLeave.approvalStatus}" style="color:#FFCCO;font-style:bold;" rendered="#{employeeLeave.approvalStatus eq 'CANCELLATION IN PROCESS'}"/>
						                <h:outputText value="#{employeeLeave.approvalStatus}" style="color:#F60000;" rendered="#{employeeLeave.approvalStatus eq 'REJECTED'}"/>
						                <h:outputText value="#{employeeLeave.approvalStatus}" style="color:#F60000;" rendered="#{employeeLeave.approvalStatus eq 'CANCELLED'}"/>
									</p:column>
									
							</p:dataTable>	
							<p:commandButton value="Download as excel file" ajax="false" rendered="#{employeeLeaveStatusBean.RENDERTABLE}" style="float: right;">
							 <p:dataExporter target="leaveStatus" type="xls" fileName="EMPLEAVESTATUS-#{employeeLeaveStatusBean.selectedMonth+1}-#{employeeLeaveStatusBean.selectedYear}"></p:dataExporter>
							</p:commandButton>
						<h:outputText value="No search results" style="color:red;font-style:bold;font-size:12px;" rendered="#{employeeLeaveStatusBean.RENDER_NO_RESULTS}"/>	
							
				</h:panelGrid>				
		  <p:growl id="growl"></p:growl>
		
		</h:form>
	</ui:define>
</ui:composition>
		